<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>apple</title>
    <link rel="stylesheet" href="css/apple.css">
    <link rel="stylesheet" href="bootstrap/bootstrap-3.3.7-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/pad1.css" media="(min-width:993px)">
    <link rel="stylesheet" href="css/xpad.css" media="(max-width:992px)">
    <link rel="stylesheet" href="css/phone.css" media="(max-width:768px)">

</head>
<body>
    <!-- nav -->
    
        <ul class="top">
            <li class="top1"><a href="#" class="top11"><img src="img/a.png" alt=""></a></li>
            <li class="top1"><a href="#" class="top11">Mac</a></li>
            <li class="top1"><a href="#" class="top11">iPad</a></li>
            <li class="top1"><a href="#" class="top11">iPhone</a></li>
            <li class="top1"><a href="#" class="top11">Watch</a></li>
            <li class="top1"><a href="#" class="top11">TV</a></li>
            <li class="top1"><a href="#" class="top11">Music</a></li>
            <li class="top1"><a href="#" class="top11">Support</a></li>
            <li class="top1"><a href="#" class="glyphicon glyphicon-search"></a></li>
            <li class="top1"><a href="#" class="glyphicon glyphicon-briefcase"></a></li>
            <div class="yincang"><img src="img/fenlei.png" alt=""></div>
            <div class="yincang"><img src="img/a.png" alt=""></div>
            <div class="yincang"><img src="img/gouwu.png" alt=""></div>
        </ul>
       <div class="fugaomax">
        <img src="img/hero-banner-baker-homepage.image.small_2x.jpg"  alt="" class="phone">
      
       <h2 class="fugao">Welcome to Apple Support</h2>
       <div class="s3 fugao1">
        <img src="img/sou.png" alt="" class="s2">
        <input type="text" placeholder="Serch Support" class="s4 fugao2">
    </div>
    </div>
   <div class="local">
       <div class="container serach">
        <div class="serach">
            <h1 class="s1">Welcome to Apple Support</h1>
            <div class="s3">
                <img src="img/sou.png" alt="" class="s2">
                <input type="text" placeholder="Serch Support" class="s4">
                
            </div>
        </div>
       </div>
   </div>
   <!-- 1 -->
   <div class="container">
       <ul class="row">
           <li class="col-md-2 home col-sm-4 col-xs-6"><a href="">
               <div>
                <img src="img/homepage_productnav_iphone_2x.png" alt="" class="home1">
               </div>
            <span class="home2">
                iPhone
            </span> </a></li>
            <li class="col-md-2 home col-sm-4 col-xs-6"><a href="">
                <div>
                 <img src="img/homepage_productnav_imac_2x.png" alt="" class="home1">
                </div>
             <span class="home2">
                Mac
             </span> </a></li>
             <li class="col-md-2 home col-sm-4 col-xs-6"><a href="">
                <div>
                 <img src="img/homepage_productnav_ipad_2x.png" alt="" class="home1">
                </div>
             <span class="home2">
                 iPad
             </span> </a></li>
             <li class="col-md-2 home col-sm-4 col-xs-6"><a href="">
                <div>
                 <img src="img/homepage_productnav_apple_watch_2x.png" alt="" class="home1">
                </div>
             <span class="home2">
                 Watch
             </span> </a></li>
             <li class="col-md-2 home col-sm-4 col-xs-6"><a href="">
                <div>
                 <img src="img/homepage_productdrawer_applemusic_2x.png" alt="" class="home1">
                </div>
             <span class="home2">
                 Music
             </span> </a></li>
             <li class="col-md-2 home col-sm-4 col-xs-6"><a href="">
                <div>
                 <img src="img/tv.png" alt="" class="home1">
                </div>
             <span class="home2">
                 TV
             </span> </a></li>  
       </ul>
      
           </ul>
       </div>
   </div>
   <!-- 2 -->
  <div class="second" >
    <div class="container">
        <ul class="row">
            <li class="col-md-4 second1 col-xs-12">
                <div class="second2"><img src="img/promo-icon-homepage-password_2x.png" alt="" class="second3"></div>
               <div class="second4">
                <a href=""  >
                    Forgot Apple ID or Password &nbsp;>
                </a>
               </div>
    
            </li>
            <li class="col-md-4 second1 col-xs-12 x">
                <div class="second2"><img src="img/promo-icon-homepage-repair_2x.png" alt="" class="second3 y"></div>
                <div class="second4">
                    <a href=""  >
                        Apple Repair &nbsp;>
                    </a>
                </div>
    
            </li>
            <li class="col-md-4 second1 col-xs-12">
                <div class="second2"><img src="img/promo-icon-homepage-subscriptions_2x.png" alt="" class="second3"></div>
                <span class="second4">
                    <a href=""  >
                        Billing and Subscriptions &nbsp;>
                    </a>
                </span>
    
            </li>
        </ul>
       </div>
  </div>
<!-- 3 -->
<div class="third">
    <div class="container bz">
        <ul class="row z">
            <li class="third1 col-md-6 col-sm-12">
                <p class="third13">
                    Update to iOS 14
                </p>
                <p class="third12" >Add widgets to your Home Screen, automatically organize your apps, and have even more fun with Messages.</p>
                <div class="third11"><a href="">Get iOS 14 &nbsp;></a></div>
            </li>
            <li class="third2 col-md-6 col-sm-12"><img src="img/featured-section-update-ios_2x.jpg" alt="" class="third21" ></li>
        </ul>
    </div>    
</div>
<div class="third">
    <div class="container bz">
        <ul class="row z">
            <li class="third1 col-md-6 col-sm-12">
                <p class="third13">
                    Trade in with Apple
                </p>
                <p class="third12" >Turn an eligible device into credit towards a new one, or recycle it for free. Apple Trade In is good for you and the planet.</p>
                <div class="third11"><a href="">Learn more &nbsp;></a></div>
            </li>
            <li class="third2 col-md-6 col-sm-12"><img src="img/featured-section-give-back-trade-in_2x.jpg" alt="" class="third21" ></li>
        </ul>
    </div>    
</div>
<!-- 4 -->
<div class="bgi">
    <div class="four1">Get Support</div>
    <div class="four2">Choose a product and we’ll find you the best solution.</div>
    <div class="four3"><a href="">Start now &nbsp;></a></div>
</div>
<div class="fugaomax">
    <img src="img/psp-hero-banner-getsupport.image.small_2x.jpg" alt="" class="phone">
    <div class="last1">Get Support</div>
    <div class="last2">Choose a product and we’ll find you the best solution.</div>
    <div class="last3"><a href="">Start now &nbsp;></a></div>

</div>
<!-- 5 -->
<div class="third">
    <div class="container bz">
        <ul class="row z">
            <li class="third2 col-md-6 col-sm-6 col-xs-12"><img src="img/applecare-products_2x.png" alt="" class="third22" ></li>
            <li class="third1 col-md-6  col-sm-6 col-xs-12">
                <p class="five13">
                    Service and support from Apple experts
                </p>
                <p class="five12" >AppleCare products provide additional hardware service options and expert technical support from Apple.</p>
                <div class="five11"><a href="">Learn about AppleCare plans &nbsp;></a></div>
            </li>
        </ul>
    </div>    
</div>
<!-- 6 -->
<div class="third">
    <div class="container bz">
        <div class="six">
            <p class="six1">Beware of counterfeit parts</p>
            <p class="six2">Some counterfeit and third party power adapters and batteries may not be designed properly and could result in safety issues. To ensure you receive a genuine Apple battery during a battery replacement, we recommend visiting an <a href="">Apple Store</a> or <a href="">Apple Authorized Service Provider</a>. If you need a replacement adapter to charge your Apple device, we recommend getting an Apple power adapter.</p>
            <p class="six2">Also non-genuine replacement displays may have compromised visual quality and may fail to work correctly. Apple-certified screen repairs are performed by trusted experts who use genuine Apple parts.</p>
        </div>
    </div>    
</div>
<div class="third">
    <div class="container bz">
        <ul class="row z">
            <li class="third2 col-md-6 col-xs-12"><img src="img/3.png" alt="" class="third21" ></li>
            <li class="third1 col-md-6 col-xs-12">
                <p class="five13">
                    Be aware of gift card scams
                </p>
                
                <div class="five11"><a href="">Learn more &nbsp;></a></div>
            </li>
        </ul>
    </div>    
</div>
<!-- 7 -->
<div class="">
    <div class="container bz">
        <div class="seven">
            <p class="six1">Apple Service Programs</p>
            <p class="six2"><a href="">iPad Air (3rd generation) Service Program for Blank Screen Issue</a></p>
            <p class="six2"><a href="">Smart Battery Case Replacement Program for iPhone XS, iPhone XS Max, and iPhone XR</a></p>
            <p class="six2"><a href="">iPhone 6s and iPhone 6s Plus Service Program for No Power Issues</a></p>
            <p class="six2"><a href="">15-inch MacBook Pro Battery Recall Program</a></p>
            <p class="six2"><a href="">Apple Three-Prong AC Wall Plug Adapter Recall Program</a></p>
            <p class="six2"><a href="">See all programs&nbsp;></a></p>
            
        </div>
    </div>    
</div>
<!-- 8 -->
<div class="bottom">
    <div class="eight1">
        <div class="eight11">Stay Connected with Apple Support</div>
        <div class="eight12">
            <img src="img/gezi.png" alt="" class="eight121">&nbsp;&nbsp;&nbsp;
            <img src="img/shipin.png" alt="" class="eight121">
            
        </div>
    </div>
    <div class="eight2 container bz">
        <p class="glyphicon glyphicon-apple eight23">&nbsp;>&nbsp;Support</p>
       <ul class="row z">
        <li class="col-xs-12 col-sm-3 e">
            <p class="eight21 zhe">Get Support</p>
            <p class="eight22"><a href="">iPhone  </a></p>
            <p class="eight22"><a href=""> iPad </a></p>
            <p class="eight22"><a href="">Watch  </a></p>
            <p class="eight22"><a href="">Mac  </a></p>
            <p class="eight22"><a href=""> Music </a></p>
            <p class="eight22"><a href="">Apple ID  </a></p>
            <p class="eight22"><a href="">Apps  </a></p>
            <p class="eight22"><a href=""> Support Site Map </a></p>
        </li>
        <li class="col-xs-12 col-sm-3 e">
            <p class="eight21">Service & Repair</p>
            <p class="eight22"><a href="">Apple Repair Options </a></p>
            <p class="eight22"><a href=""> Service and Repair Information </a></p>
            <p class="eight22"><a href="">AppleCare Products </a></p>
            <p class="eight22"><a href="">Hardware Warranties </a></p>
            <p class="eight22"><a href=""> Software License Agreements </a></p>
            <p class="eight22"><a href="">Complimentary Support </a></p>

        </li>
        <li class="col-xs-12 col-sm-3 e">
            <p class="eight21">Resources</p>
            <p class="eight22"><a href="">Downloads & Updates  </a></p>
            <p class="eight22"><a href=""> Manuals</a></p>
            <p class="eight22"><a href="">Tech Specs</a></p>
            <p class="eight22"><a href="">Accessibility  </a></p>
            <p class="eight22"><a href="">Education</a></p>
            <p class="eight22"><a href="">Business</a></p>
            <p class="eight22"><a href="">Apple Support Videos</a></p>
        </li>
        <li class="col-xs-12 col-sm-3 e">
            <p class="eight21">Connect</p>
            <p class="eight22"><a href="">Contact Us </a></p>
            <p class="eight22"><a href="">Phone Numbers </a></p>
            <p class="eight22"><a href="">My Support</a></p>
            <p class="eight22"><a href="">Apple Support App</a></p>
            <p class="eight22"><a href=""> Apple Support Communities </a></p>
           
        </li>
          
       </ul>
    </div>
</div>
<!-- 9 -->
<div class="end">
    <span class="nine4"><span class="nine">Copyright © 2020 Apple Inc. All rights reserved.</span>
    <span class="nine1">Privacy Policy&nbsp;&nbsp;|&nbsp;&nbsp; Terms of Use&nbsp;&nbsp;|&nbsp;&nbsp; Sales and Refunds &nbsp;&nbsp;|&nbsp;&nbsp;Site Map</span></span>
    <span class="nine2"><img src="img/us.png" alt="" class="nine3" >United States</span>
</div>
       

    
</body>
</html>